<template>
  <video id="videoPlayer" :src="src" :width="width" :height="height" controls />
</template>

<script>
import merge from '@/utils/merge'
import axios from '@/utils/request'
import { LOCAL_ADMIN_TOKEN } from '@/utils/constants.js'

const DefaultWkVideo = {
  fileRequest: null, // 添加请求和参数
  fileParams: null
}

export default {
  // 视频播放组件
  name: 'WkVideo',

  components: {},

  props: {
    props: Object,
    width: {
      type: [String, Number],
      default: '100%'
    },
    height: {
      type: [String, Number],
      default: '100%'
    }
  },

  data() {
    return {
      sourceData: ''
    }
  },

  computed: {
    // 合并 props
    config() {
      return merge({ ...DefaultWkVideo }, this.props || {})
    },

    src() {
      return `${process.env.VUE_APP_BASE_API}${this.config.fileParams}?c=${axios.defaults.headers.common[LOCAL_ADMIN_TOKEN]}`.replace('//', '/')
    }
  },

  methods: {}
}
</script>

  <style lang="scss" scoped>

  </style>

